header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .2267rem .2933rem .1333rem;
    .back-button {
        width: 1.64rem;
        background-color: #ffffff;
        border-radius: 0.267rem;
        border: .027rem solid #ff9344;
        text-align: center;
        h2 {
            font-size: 0.347rem;
            font-weight: normal;
            font-stretch: normal;
            letter-spacing: 0rem;
            line-height: 0.56rem;
            color: #000000;
        }
    }
    .middle {
        text-align: center;
        h2 {
            font-size: 0.347rem;
            font-weight: normal;
            font-stretch: normal;
            line-height: 0.607rem;
            letter-spacing: 0rem;
            color: #000000;
        }
    }
    .select {
        position: relative;
        img {
            width: 0.827rem;
            height: 0.573rem;
        }
        button {
            position: absolute;
            border-radius: 50%;
            color: white;
            background-color: red;
            font-size: 0.267rem;
            border: 0;
            top: -.13rem;
            left: .45rem;
        }
    }
}

.user-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding: .253rem .307rem 0 .293rem;
    .user-wrap-img {
        display: flex;
        align-items: center;
        img {
            width: 2.267rem;
            height: 2.267rem;
            border-radius: 50%;
        }
        .user-wrap-text {
            margin-left: .333rem;
            h2 {
                font-size: 0.4rem;
                line-height: 0.467rem;
            }
            p {
                font-size: 0.347rem;
                line-height: 0.7rem;
                letter-spacing: 0rem;
                color: #9d9d9d;
            }
        }
    }
    .user-wrap-right {
        p {
            font-size: 1.161rem;
            font-weight: normal;
            font-stretch: normal;
            line-height: 0.607rem;
            letter-spacing: 0rem;
            color: #010101;
        }
    }
}

.user-news {
    font-size: 0.347rem;
    line-height: 0.607rem;
    display: flex;
    justify-content: space-around;
    margin-top: .347rem;
    .box1 {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: center;
        width: 2.6rem;
        height: 2.013rem;
        background-color: #b2e0a0;
        .box1-img {
            width: .52rem;
            height: .52rem;
            background: url(../images/jinglingtu.png) no-repeat 0 -2.2667rem;
            background-size: 3.1067rem 2.8267rem;
            transform: scale(200%, 200%);
            margin-bottom: .247rem;
        }
    }
    .box2 {
        width: 2.6rem;
        height: 2.013rem;
        background-color: #a0dce0;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: center;
        .box2-img {
            width: .52rem;
            height: .52rem;
            background: url(../images/jinglingtu.png) no-repeat -2.299rem -2.3rem;
            background-size: 3.1067rem 2.8267rem;
            transform: scale(200%, 200%);
            margin-bottom: .247rem;
        }
    }
    .box3 {
        width: 2.6rem;
        height: 2.013rem;
        background-color: #e0b7a0;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: center;
        .box3-img {
            width: .82rem;
            height: .52rem;
            background: url(../images/jinglingtu.png) no-repeat -2.2667rem -0.5733rem;
            background-size: 3.1067rem 2.8267rem;
            transform: scale(200%, 200%);
            margin-bottom: .247rem;
        }
    }
}

.user-handle {
    margin-top: .427rem;
    padding: 0 .28rem;
    .user-handle-top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        .user-handle-left {
            display: flex;
            align-items: center;
            .logo-1 {
                width: .4133rem;
                height: .4rem;
                background: url(../images/jinglingtu.png) no-repeat -1.6933rem -1.1333rem;
                background-size: 3.1067rem 2.8267rem;
                margin-right: .507rem;
            }
            p {
                font-size: 0.347rem;
                line-height: 0.607rem;
                letter-spacing: 0rem;
            }
        }
        .user-handle-right {
            display: flex;
            align-items: center;
            p {
                font-size: 0.32rem;
                line-height: 0.7rem;
            }
            .logo-2 {
                width: .1867rem;
                height: .1867rem;
                background: url(../images/jinglingtu.png) no-repeat -1.9867rem -2.2667rem;
                background-size: 3.1067rem 2.8267rem;
            }
        }
        &:nth-child(4) {
            margin-bottom: 1.035rem;
        }
    }
    .user-handle-bottom {
        display: flex;
        align-items: center;
        justify-content: space-between;
        .user-handle-bottom-left {
            display: flex;
            align-items: center;
            .logo-3 {
                width: .4133rem;
                height: .4133rem;
                background: url(../images/jinglingtu.png) no-repeat -1.6933rem -1.6933rem;
                background-size: 3.1067rem 2.8267rem;
                margin-right: .12rem;
            }
            p {
                font-size: 0.347rem;
                line-height: 0.607rem;
                letter-spacing: 0rem;
            }
        }
        .user-handle-bottom-right {
            display: flex;
            align-items: center;
            p {
                font-size: 0.32rem;
                line-height: 0.7rem;
            }
            .logo-4 {
                width: .1867rem;
                height: .1867rem;
                background: url(../images/jinglingtu.png) no-repeat -1.9867rem -2.2667rem;
                background-size: 3.1067rem 2.8267rem;
            }
        }
    }
    >div:nth-child(2) {
        .user-handle-left {
            .logo-1 {
                width: .4rem;
                height: .4133rem;
                background: url(../images/jinglingtu.png) no-repeat -0.5733rem -2.2667rem;
                background-size: 3.1067rem 2.8267rem;
            }
        }
    }
    >div:nth-child(3) {
        .user-handle-left {
            .logo-1 {
                width: .4133rem;
                height: .4rem;
                background: url(../images/jinglingtu.png) no-repeat -2.2667rem -1.1333rem;
                background-size: 3.1067rem 2.8267rem;
            }
        }
    }
    >div:nth-child(4) {
        .user-handle-left {
            .logo-1 {
                width: .4133rem;
                height: .4133rem;
                background: url(../images/jinglingtu.png) no-repeat -2.2667rem 0;
                background-size: 3.1067rem 2.8267rem;
            }
        }
    }
    >div:nth-child(6) {
        .user-handle-bottom-left {
            .logo-3 {
                height: .4133rem;
                background: url(../images/jinglingtu.png) no-repeat -1.1333rem -2.2667rem;
                background-size: 3.1067rem 2.8267rem;
            }
        }
    }
}

.user-button {
    font-size: 0.32rem;
    line-height: 0.56rem;
    letter-spacing: 0rem;
    display: flex;
    justify-content: space-around;
    margin-top: .48rem;
    button {
        border-radius: 44%;
        background-color: #ff9344;
        color: #ffffff;
        width: 1.96rem;
        height: 1.013rem;
        border: 0;
    }
}

.nav-bottom {
    width: 100%;
    position: fixed;
    bottom: 0;
    background-color: #fff;
    ul {
        display: flex;
        list-style: none;
        list-style: none;
        justify-content: space-around;
        li {
            a {
                text-decoration: none;
                flex: 1;
                display: flex;
                flex-direction: column;
                align-items: center;
                .picture-1 {
                    width: .52rem;
                    height: .52rem;
                    background: url(../images/jinglingtu.png) no-repeat 0 0;
                    background-size: 3.1067rem 2.8267rem;
                }
                .picture-2 {
                    width: .52rem;
                    height: .52rem;
                    background: url(../images/jinglingtu.png) no-repeat -0.5733rem 0;
                    background-size: 3.1067rem 2.8267rem;
                }
                .picture-3 {
                    width: .52rem;
                    height: .52rem;
                    background: url(../images/jinglingtu.png) no-repeat -1.12rem 0;
                    background-size: 3.1067rem 2.8267rem;
                }
                .picture-4 {
                    width: .52rem;
                    height: .52rem;
                    background: url(../images/jinglingtu.png) no-repeat -1.6933rem -0.5733rem;
                    background-size: 3.1067rem 2.8267rem;
                }
                h2 {
                    font-size: 0.347rem;
                    font-weight: normal;
                    font-stretch: normal;
                    line-height: 0.7rem;
                    letter-spacing: 0rem;
                    color: #000000;
                }
            }
        }
    }
}